import Taro, { Component } from '@tarojs/taro'
import { View } from '@tarojs/components'

import MyVideo from '@components/my-video'

import relatedApi from '@api/recommend'

import './index.scss'

class RelativeVideo extends Component {
  constructor(props) {
    super(props)
    this.state = {
      videoList: []
    }
  }

  config = {
    navigationBarTitleText: '相关视频',
    navigationBarTextStyle: 'black',
    navigationBarBackgroundColor: '#FFF',
    backgroundTextStyle: 'light',
    enablePullDownRefresh: false,
    backgroundColor: '#FFF'
  }

  componentWillMount () {
    const id = this.$router.params.id
    relatedApi.relatedVideo({id: id}).then(res => {
      this.setState({
        videoList: res.data
      })
    })
  }

  render() { 
    return (
      <View className='relative-video'>
        {
          this.state.videoList.map((item, index) => {
            return (
              <MyVideo key={item + index} info={item} />
            )
          })
        }
      </View>
    )
  }
}
 
export default RelativeVideo
